import React, { Component } from 'react';
import { getGood_favlist, getGood_unfav } from '../api/index';
import { NavBar } from 'antd-mobile';
import '../styles/favorite.css'

class FavoriteJsx extends Component {
    constructor(props) {
        super(props);
        this.state = {
            collectList:[],
        }
    }
    componentDidMount() {
        const myid = localStorage.getItem("userId")
        getGood_favlist({ userid: myid }).then(res => {
            console.log(res.data.list);
            this.setState({collectList:res.data.list})
        })
    }
    // 点击返回
    back() {
        this.props.history.go(-1)
    }
    // 点击取消收藏
    cancel(index) {
        const myid = localStorage.getItem("userId")
        const shopid = this.state.collectList[index].id
        getGood_unfav({userid:myid,goodid:shopid}).then(res=>{
            console.log(res);
            this.props.history.go();
        })
    }
    render() {
        return (
            <div className='favorite'>
                <NavBar onBack={() => { this.back() }}>我的收藏</NavBar>
                
                    {
                        this.state.collectList.map((item,index)=>{
                            return (
                                <div className='favor_box' key={index}>
                                    <img src={item.pic} alt="" />
                                    <div className='favor_box1'>
                                        <span>{item.name}</span>
                                        <div className='favor_box1-1'>
                                            <span>活动价￥{item.salesPrice.value}</span>
                                            <div onClick={()=>{this.cancel(index)}}>取消收藏</div>
                                        </div>
                                    </div>
                                </div>
                            )
                        })
                    }
                
            </div>
        );
    }
}

export default FavoriteJsx;